<template>
  <a-card id="all" :bordered="false">
    <a-row>
      <a-col>
        <a-card class="table" :bordered="false">
          <a-tabs :defaultActiveKey="tabKey" @change="callback">
            <a-tab-pane tab="温度过高" key="1">
              <temperature />
            </a-tab-pane>
            <a-tab-pane tab="电流过大" key="2" forceRender>
              <temperature />
            </a-tab-pane>
            <a-tab-pane tab="电量过低" key="3">
              <temperature />
            </a-tab-pane>
            <a-tab-pane tab="电压过大" key="4">
              <temperature />
            </a-tab-pane>
          </a-tabs>
        </a-card>
      </a-col>
    </a-row>
  </a-card>
</template>


<script>
import temperature from "./components/temperature";
export default {
  data(){
    return{
      tabKey:"1"
    }
  },
  created(){
   if(this.$route.query.type=="temperature"){
     this.tabKey="1"
   }else if(this.$route.query.type=="electricity"){
     this.tabKey="2"
   }else if(this.$route.query.type=="power"){
     this.tabKey="3"
   }else if(this.$route.query.type=="pressure"){
     this.tabKey="4"
   }
  },
  components: {
    temperature
  }
};
</script>

<style scoped>
#all {
  width: 1620px;
  height: 100%;
  /* background: rgba(239, 244, 247, 1); */
 
}
.table{
  background-color: rgba(255,255,255,.1);
  margin-top:-30px;
  margin-left:-20px
  
}
</style>